<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>编程资源-编程导航</title>
    <link type="favicon" rel="shortcut icon" th:href="@{/img/pns.png}">
    <link rel="stylesheet" th:href="@{/css/main.css}">
    <link rel="stylesheet" th:href="@{/css/resources.css}">
    <!-- 引入Font Awesome图标 -->
    <link rel="stylesheet" th:href="@{/font-awesome/css/font-awesome.min.css}">
    <!-- 引入Jquery  -->
    <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
    <!-- 引入Layui.css -->
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
    <script th:src="@{/js/vue.js}"></script>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.zhimg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.zhimg.com/element-ui/lib/index.js"></script>
    <!-- 引入Layui.js -->
    <script th:src="@{/layui/layui.js}"/></script>
    <script th:src="@{/js/commen.js}"></script>
    <script th:src="@{/js/reslist.js}"></script>
    <link type="text/css" rel="stylesheet" th:href="@{/css/reslist.css}">

</head>

<body>
<!-- 导航条  -->
<div class="toolbar">
    <div class="layui-container">
        <div class="layui-row">
            <div class="toolbar-container-left layui-col-md4">
                <div class="toolbar-logo">
                    <img th:src="@{/img/logo.png}" title="网站首页">
                </div>
                <div class="toolbar-menus">
                    <ul>
                        <li><a th:href="@{/}" title="网站首页">首页</a></li>
                        <li><a th:href="@{/resources}" title="编程资源">资源</a></li>
<!--                        <li><a th:href="index.html" title="世界">世界</a></li>-->
                        <li><a th:href="@{/rank}" title="全站热门内容">排行</a></li>
                    </ul>
                </div>
            </div>
            <div class="toolbar-container-middle layui-col-md4">
                <form action="/search" method="POST" class="layui-form">
                    <input id="Search" type="text" name="key" required lay-verify="required" placeholder="请输入关键字搜索"
                           autocomplete="off" list="searchList" class="layui-input search-input">
                    <button type="button" class="layui-btn search">搜索</button>
                </form>
            </div>
            <div class="toolbar-container-right layui-col-md4">
                <ul class="layui-nav">
                    <li class="layui-nav-item">
                        <a href=""><i class="el-icon-circle-plus"></i>&nbsp;创作</a>
                        <dl class="layui-nav-child">
                            <dd><a th:href="@{/article/write}"><i class="layui-icon layui-icon-edit"></i>&nbsp;写文章</a></dd>
                            <dd><a th:href="@{/resource/add}"><i class="el-icon-upload"></i>&nbsp;上传资源</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item">
                        <a href=""><i class="layui-icon layui-icon-notice"></i>消息</a>
                    </li>
                    <li class="layui-nav-item account">
                        <a href="">
                            <img src="" class="layui-nav-img">
                            <span>我</span>
                        </a>
                        <dl class="layui-nav-child">
                            <dd><a th:href="@{/user/account/account}" target="_blank"><i class="fa fa-universal-access"
                                                                                         aria-hidden="true"></i>&nbsp;账号管理</a></dd>
                            <dd><a th:href="@{/user/account/article}" target="_blank"><i class="fa fa-arrows-alt"></i>&nbsp;我的博客</a>
                            </dd>
                            <dd><a th:href="@{/user/account/res/}" target="_blank"><i class="fa fa-database"></i>&nbsp;我的分享</a></dd>
                            <dd><a th:href="@{/user/logout}"><i class="fa fa-sign-out"
                                                                aria-hidden="true"></i>&nbsp;退出</a></dd>
                        </dl>
                    </li>
                    <li class="LoginAndRegister">
                        <a th:href="@{/user/login}">登录</a>&nbsp;/&nbsp;<a th:href="@{/user/register}">注册</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class="main">
    <div class="layui-side layui-bg-black layui-nav-side">
        <div class="layui-side-scroll">
            <div title="菜单缩放" class="kit-side-fold"><i class="fa fa-navicon" aria-hidden="true"></i></div>
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree" lay-filter="test">
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;" id="book"><i class="fa fa-book fa-lg"></i> <span>书籍</span></a>
                </li>
                <li class="layui-nav-item">
                    <a class="" href="javascript:;" id="course"><i class="fa fa-th fa-lg"></i> <span>教程</span></a>
                </li>
                <li class="layui-nav-item">
                    <a class="" href="javascript:;" id="tool"><i class="fa fa-wrench fa-lg"></i> <span>工具</span></a>
                </li>
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;"><i class="fa fa-free-code-camp fa-lg"></i> <span>编程语言</span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="javascript:;" id="cpp"> <span>C/C++</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="Java"> <span>Java</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="Python"> <span>Python</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="JavaScript"> <span>Javascript</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="GO"> <span>GO</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="PHP"> <span>PHP</span></a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="fa fa-fire fa-lg"></i> <span>研究热门</span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="javascript:;" id="AI"><span>人工智能</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="data"> <span>大数据</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="HarmonyOS"> <span>鸿蒙</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="yun"> <span>云计算</span></a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="fa fa-hand-o-right fa-lg"></i> <span>考研408</span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="javascript:;" id="dataStructure"><span>数据结构</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="zcyl"> <span>计算机组成原理</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="os"> <span>操作系统</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="net"> <span>计算机网络</span></a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="fa fa-connectdevelop fa-lg"></i> <span>前端</span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="javascript:;" id="jcjc"><span>基础教程</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="kuangjia"> <span>开发框架</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="lib"> <span>常用库</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" is="pack"> <span>打包工具</span></a>
                        </dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="fa fa-area-chart" aria-hidden="true"></i> <span>后端&运维</span></a>
                    <dl class="layui-nav-child">
                        <dd>
                            <a href="javascript:;" id="fwq"><span>云服务器</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="sjk"> <span>数据库</span></a>
                        </dd>
                        <dd>
                            <a href="javascript:;" id="doc"> <span>开发文档</span></a>
                        </dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>
    <div class="content layui-col-md12">
        <div class="container layui-col-md12 reslist">
            <div id="empty">
                <el-empty description="该分类下暂时还没有资源"></el-empty>
            </div>
            <script type="text/javascript">
                new Vue({
                    el: '#empty',
                })
            </script>
            <!--<div id="page"></div>-->
        </div>
    </div>
</div>
</body>

</html>